var chess = new Chess({
  chessSize: [2, 5],
  sourceImage: [
    'images/image-1.jpg',
    'images/image-2.jpg',
    'images/image-3.jpg',
    'images/image-4.jpg',
    'images/image-5.jpg',
    'images/image-6.jpg',
    'images/image-7.jpg',
    'images/image-8.jpg',
    'images/image-9.jpg',
    'images/image-10.jpg',
    'images/image-11.jpg',
    'images/image-12.jpg',
    'images/image-13.jpg',
    'images/image-14.jpg',
    'images/image-15.jpg',
    'images/image-16.jpg',
    'images/image-17.jpg',
    'images/image-18.jpg',
    'images/image-19.jpg',
    'images/image-20.jpg',
  ],
  imageCouple: 5,
  mode: 'couple',
});
chess.initChess();
var vm = new Vue({
  el: '#chessboard',
  data: {
    chess: chess._chessMap,
    searchStart: [],
    searchEnd: [],
    clickLock: false,
    leftImage: chess.chessSize[0] * chess.chessSize[1],
    // 总分
    scoreTotal: 0,
    // 单次成功得分
    scoreStep: 10,
    // 奖励分
    scoreAward: 0,
    // 连击奖励加分
    scoreSerial: 5,
    countDown: 60,
    countDownInit: 60,
    isStart: false,
    timer: null,
  },
  computed: {

  },
  watch: {
    searchStart() {},
    searchEnd() {},
    isStart(newValue, oldValue) {
      if(newValue) {
        // 开始计时
      }
    },
    countDown(newValue, oldValue) {
      // 倒计时结束
      if(newValue <= 0) {
        this.isStart = false;
        // 调出分数
        this.showScore();
      }
    },
    leftImage(newValue, oldValue) {
      // 图片全部消除完
      if(newValue <= 0) {
        this.isStart = false;
        // 调出分数
        this.showScore();
      }
    },
  },
  methods: {
    startGame() {
      // 如果时间不是初始，则需要重置游戏
      if(this.countDown !== this.countDownInit) {
        this.resetGame();
      }
      this.isStart = true;
      this.countDownFn();
    },
    resetGame() {
      chess.initChess();
      this.chess = chess._chessMap;
      this.scoreTotal = 0;
      this.scoreAward = 0;
      this.leftImage = chess.chessSize[0] * chess.chessSize[1];
      this.countDown = this.countDownInit;
      this.isStart = false;
      clearTimeout(this.timer);
    },
    click(type, position) {
      if(!this.isStart){
        alert('点击开始后，开始游戏');
        return false;
      }
      // 如果是空白或是点击锁，则点击无效
      if(type === 'blank' || this.clickLock || this.searchStart === position) {
        return false;
      }
      if(this.searchStart.length === 0){
        // 设置起点
        this.searchStart = position;
        this.btnSetActive(position);
      } else {
        /**
         * 如果存在起点，则将新的点设置为终点，
         * 并开始计算是否可以消除
         */
        this.searchEnd = position;
        this.btnSetActive(position);
        // 运行锁
        this.clickLock = true;
        // 开始搜索
        var res = chess.search(this.searchStart, this.searchEnd);
        res.forEach(function(item){
          console.log(item);
        });
        console.log('---------------');
        if(this.isCouple() && res && this.inCorner(res, 4)){
          // 积分
          this.leftImage -= 2;
          // 总分
          this.scoreTotal += (this.scoreStep + this.scoreAward);
          // 增加连击奖励
          this.scoreAward += this.scoreSerial;
          //存在路径，并且折数在规定内，并且图片是一对
          this.btnSetNone(this.searchStart);
          this.btnSetNone(this.searchEnd);
          // 添加空白区域
          chess._blankPosition.push(this.searchStart, this.searchEnd);
          // 清空已消除棋盘
          this.searchStart = [];
          this.searchEnd = [];
        } else {
          // 清空连击奖励分
          this.scoreAward = 0;
          // 路径不存在或者图片不是一对
          // 清空开始样式
          this.btnSetDefault(this.searchStart);
          // 将结束标记设置为开始标记，并清除结束标记
          this.searchStart = this.searchEnd;
          this.searchEnd = [];
        }
        // 解除运行锁
        this.clickLock = false;
      }
    },

    /**
     * 判断图片是不是一对
     */
    isCouple() {
      var key1 = this.chess[this.searchStart[0]][this.searchStart[1]];
      var key2 = this.chess[this.searchEnd[0]][this.searchEnd[1]];
      if(chess.mode === 'couple') {
        var num1= parseInt(key1.backgroundImage.replace(/[^0-9]/ig, ''));
        var num2= parseInt(key2.backgroundImage.replace(/[^0-9]/ig, ''));
        var max = num1 > num2 ? num1 : num2;
        var min = num1 < num2 ? num1 : num2;
        return (max - min) === 1 && min % 2 === 1;
      } else {
        return key1.backgroundImage === key2.backgroundImage;
      }

    },

    inCorner(path, cornerNumber) {
      var start = path.shift();
      var tmpNumber = 0;
      var tag = null;
      while(path.length > 0){
        var tmp = path.shift();
        var tmpTag = start[0] === tmp[0] ? 'x' : 'y';
        if(!tag) {
          tag = tmpTag
        }
        if(tag !== tmpTag){
          // 方向发生变化
          tag = tmpTag;
          tmpNumber += 1;
        }
        start = tmp;
      }
      return cornerNumber >= tmpNumber;
    },

    btnSetActive(position) {
      this.chess[position[0]][position[1]]['className'] = ['active'];
    },

    btnSetDefault(position) {
      this.chess[position[0]][position[1]]['className'] = ['normal'];
    },

    btnSetNone(position) {
      this.chess[position[0]][position[1]]['className'] = ['none'];
      this.chess[position[0]][position[1]]['type'] = 'blank';
    },

    countDownFn() {
      this.countDown -= 1;
      var that = this;
      if(this.countDown <= 0 || !this.isStart){
        return;
      }
      clearTimeout(this.timer);
      this.timer = setTimeout(function(){
        that.countDownFn();
      } ,1000);
    },

    showScore() {
      console.info('你的得分是：' + this.scoreTotal);
    }
  },
});

function setStyle() {
  var td = $('.chess-container .td.normal');
  td.css({
    height: td.eq(0).width(),
  });
}
$(document).ready(function() {
  setStyle();
});
